<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			table{
				margin: 0 auto;
				text-align: center;
			}
		</style>
	</head>
	<body>
		<table  border="0" cellspacing="" cellpadding="">
			<tr>
				<td>
					<select id="sel" name="">
						<option value="none">选择大小</option>
						<option value ="big">大</option>
						<option value ="smoue">小</option>
					</select>
				</td>
			</tr>
			<tr>
				<td width="120" height="120" ><img id="img" src="./img/work2/1.jpg" ></td>
				
			</tr>
			<tr>
				<td><button type="button" id="btn" onclick="DoONclick(event)">开始</button></td>
			</tr>
		</table>
	</body>
	<script type="text/javascript">
		
		function DoONclick(e){
			//设定数值
			var sel = document.getElementById('sel')
			console.log(sel.value)
			if (sel.value == 'none') {
				alert('没有选大小')
				return
			}
			e.target.innerText='投掷中···'
			document.getElementById('btn').disabled=true
			var times=0
			var test =setInterval(function(){
			var num = GetRandom()
			console.log(num)
			document.getElementById('img').src='./img/work2/'+num+'.jpg'
				if(times>40){
					clearInterval(test)
					e.target.innerText='重新投掷'
					document.getElementById('btn').disabled=false
					setTimeout(function(){
						switch (sel.value){
							case 'big':
								if (num>=4) {
									alert('猜对了')
								}else{
									alert('猜错了')
								}
								break;
							case 'smoue':
								if (num<=3) {
									alert('猜对了')
								}else{
									alert('猜错了')
								}
								break;
							default:
								break;
						}
					})
					console.log(num)
				}
				times++;
			},50)
			
			
		}
		
		function GetRandom(){
			while(true){
				var num = Math.floor(Math.random()*7)
				
				if(num != 0){
					return num
				}
			}
		}
	</script>
</html>
